<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>QQ会员</title>
		<link rel="shortcut icon" href="img/favicon.ico">
		<style type="text/css">
			* {
				margin: 0% auto;
				padding: 0%;
			}

			header {
				width: 100%;
				height: 100px;
				background-color: gray;
			}

			.top {
				width: 1200px;
				height: 100px;
				/* background-color: beige; */
			}

			.log {
				width: 150px;
				height: 100px;
				float: left;
			}


			ul {
				width: 700px;
				height: 100px;
				float: left;
			}

			li {
				list-style: none;
				float: left;
				width: 100px;
				text-align: center;
				height: 100px;
				line-height: 100px;
			}

			a {
				text-decoration: none;
				color: white;
			}

			a:hover {
				color: red;
			}

			.but {
				width: 350px;
				height: 100px;
				float: left;
				/* background-color: aqua; */
				line-height: 100px;
			}

			.but a {
				width: 100px;
				height: 40px;
				display: inline-block;
				line-height: 40px;
				text-align: center;
				border-radius: 40px;
				font-weight: bold;
			}

			.but a:nth-child(1) {
				border: 2px solid #FCD74F;
				color: #FCD74F;
				margin-left: 40px;
			}

			.but a:nth-child(2) {
				padding: 0px 20px;
				border: 2px solid #FCD74F;
				color: #986B0D;
				background-color: #FCD74F;
				margin-left: 40px;
			}

			.but a:nth-child(1):hover {
				background-color: #FCD74F;
				color: gray;
			}

			.but a:nth-child(2):hover {
				background-color: #FFE48A;
			}
		</style>
	</head>
	<body>
		<header>
			<div class="top">
				<div class="log">
					<img src="./img/QQ会员/logo.png" alt="" width="145px" height="90px">
				</div>
				<ul>
					<li><a href="">功能特权</a></li>
					<li><a href="">游戏特权</a></li>
					<li><a href="">生活特权</a></li>
					<li><a href="">会员活动</a></li>
					<li><a href="">成长体系</a></li>
					<li><a href="">年费专区</a></li>
					<li><a href="">超级会员</a></li>
				</ul>
				<div class="but">
					<a href="">登陆</a>
					<a href=""> 开通超级会员</a>
				</div>
			</div>
		</header>
	</body>
</html>
